<!-- <template>
    <div name="Item">
        <!-- <span> {{ status }}</span> -->
        <input v-if="editable" v-model="itemText">
        <span v-else :class="{ 'line-through': isStriked }">{{ itemText }}</span>
        <el-button icon="el-icon-edit" circle @click="itemOK">
            <!-- {{ editable ? 'Done' : 'Edit' }} -->
        </el-button>
        <el-button icon="el-icon-check" circle @click="itemSubmit"></el-button>
        <!-- <el-button icon="el-icon-delete" circle @click="itemDelete"></el-button> -->
        <button @click="toggle">更多信息</button>
        <div v-if="openStatus">
            <code style="color: red;" v-if="this.item.addtime">创建时间：{{ this.item.addtime }}<br></code>
            <code style="color: red;" v-if="this.item.addname">创建者：{{ this.item.addname }}</code>
            <code style="color: red;" v-if="this.item.complete_time">完成时间：{{ this.item.complete_time }}<br></code>
            <code style="color: red;" v-if="this.item.complete_name">完成者：{{ this.item.complete_name }}<br></code>
            <code style="color: red;" v-if="this.item.status_text">状态：{{ this.item.status_text }}<br></code>
        </div>
    </div>
</template>

<script>
import axios from 'axios'
import WebSocketUtil from '@/utils/ws.js'
export default {
    props: ['item'],
    data() {
        return {
            itemText: this.item.title,
            isStriked: false,
            editable: false,
            openStatus: false,
            ws: null,
            ip: '',
            usernameInput: ''
        }
    },
    mounted() {
        console.log("item的id是：" + this.item.id);
        // console.log("itemStatus 状态为：" + this.itemStatus);
    },
    methods: {
        itemOK() {
            this.editable = !this.editable
            this.ws = new WebSocketUtil();
                const url = "ws://192.168.99.117:3000";
                this.ws
                    .connect(url + "?name=" + this.$parent.usernameInput + "&ip=" + this.$parent.ip)
                    const i = {
                        'type': 'complete',
                        'user': this.$parent.usernameInput,
                        'id': this.item.id
                    };
                this.ws.sendMessage(i)
        },
        // 完成
        async itemSubmit() {
            if (this.itemText) {
                this.isStriked = !this.isStriked
                this.ws = new WebSocketUtil();
                const url = "ws://192.168.99.117:3000";
                this.ws
                    .connect(url + "?name=" + this.$parent.usernameInput + "&ip=" + this.$parent.ip)
                    const i = {
                        'type': 'edit',
                        'user': this.$parent.usernameInput,
                        'id': this.item.id
                    };
                this.ws.sendMessage(i)
                // this
                // await axios.post('http://192.168.99.117:3000/submit', {
                //     // username: this.usernameInput
                // })
            } else {
                this.isStriked = false
            }
        },
        // async itemDelete() {
        //     if (this.itemText) {
        //         await axios.post('http://192.168.99.117:3000/delete', {
        //             // username: this.usernameInput
        //         })
        //     } else {
        //         this.isStriked = false
        //     }
        // },
        toggle() {
            this.openStatus = !this.openStatus
        }
    },
    computed: {
        // itemInput: {
        //     get() {
        //         // this.itemStatus = 1;
        //         return this.itemText
        //     },
        //     set(newVal) {
        //         this.itemStatus = newVal;
        //     }
        // }
    }
}
</script>

<style>
.line-through {
    text-decoration: line-through;
}
</style> -->